    <style include="cr-shared-style settings-shared settings-page-styles iron-flex">
      :host {
        --about-page-image-space: 10px;
      }

      .info-sections {
        padding: var(--cr-section-vertical-padding) var(--cr-section-padding);
      }

      .info-section {
        margin-bottom: 12px;
      }

      .product-title {
        font-size: 153.85%;  /* 20px / 13px */
        font-weight: 400;
        margin-bottom: auto;
        margin-top: auto;
      }

      img {
        margin-inline-end: var(--about-page-image-space);
      }

      .icon-container {
        margin-inline-end: var(--about-page-image-space);
        min-width: 32px;  /* The width of the product-logo img. */
        text-align: center;
      }

      iron-icon[icon='settings:check-circle'] {
        fill: var(--cr-checked-color);
      }

      iron-icon[icon='cr:error'] {
        fill: var(--settings-error-color);
      }

      cr-button {
        white-space: nowrap;
      }
    </style>
    <settings-section page-title="$i18n{aboutPageTitle}" section="about">
      <div class="cr-row two-line first">
<if expr="not lacros or not _google_chrome">
        <img id="product-logo" on-click="onProductLogoTap_"
            srcset="chrome://theme/current-channel-logo@1x 1x,
                    chrome://theme/current-channel-logo@2x 2x"
            alt="$i18n{aboutProductLogoAlt}"
            role="presentation">
</if>
<if expr="_google_chrome and lacros">
        <img id="product-logo" on-click="onProductLogoTap_"
            srcset="chrome://theme/IDR_PRODUCT_LOGO_32_CANARY@1x 1x,
                    chrome://theme/IDR_PRODUCT_LOGO_32_CANARY@2x 2x"
            alt="$i18n{aboutProductLogoAlt}"
            role="presentation">
</if>
        <h1 class="product-title">$i18n{aboutProductTitle}</h1>
      </div>
      <div class="cr-row two-line">
        <!-- Set the icon from the iconset (when it's obsolete/EOL and
          when update is done) or set the src (when it's updating). -->
<if expr="not chromeos">
        <div class="icon-container"
            hidden="[[!shouldShowIcons_(showUpdateStatus_)]]">
          <iron-icon
              icon$="[[getUpdateStatusIcon_(
                  obsoleteSystemInfo_, currentUpdateStatusEvent_)]]"
              src="[[getThrobberSrcIfUpdating_(
                  obsoleteSystemInfo_, currentUpdateStatusEvent_)]]">
          </iron-icon>
        </div>
</if>
        <div class="flex cr-padded-text">
<if expr="not chromeos">
          <div id="updateStatusMessage" hidden="[[!showUpdateStatus_]]">
            <div
                inner-h-t-m-l="[[getUpdateStatusMessage_(
                    currentUpdateStatusEvent_)]]">
            </div>
            <a hidden$="[[!shouldShowLearnMoreLink_(
                currentUpdateStatusEvent_)]]" target="_blank"
                href="https://support.google.com/chrome?p=update_error">
              $i18n{learnMore}
            </a>
          </div>
          <span id="deprecationWarning"
              hidden="[[!obsoleteSystemInfo_.obsolete]]">
            $i18n{aboutObsoleteSystem}
            <a href="$i18n{aboutObsoleteSystemURL}" target="_blank">
              $i18n{learnMore}
            </a>
          </span>
</if>
          <div class="secondary">$i18n{aboutBrowserVersion}</div>
<if expr="chromeos">
          <div class="secondary"
              inner-h-t-m-l="[[getUpdateOsSettingsLink_()]]">
          </div>
</if>
        </div>
<if expr="not chromeos">
        <div class="separator" hidden="[[!showButtonContainer_]]"></div>
        <span id="buttonContainer" hidden="[[!showButtonContainer_]]">
          <cr-button id="relaunch" hidden="[[!showRelaunch_]]"
              on-click="onRelaunchTap_">
            $i18n{aboutRelaunch}
          </cr-button>
        </span>
</if>
      </div>
<if expr="_google_chrome and is_macosx">
      <template is="dom-if" if="[[!promoteUpdaterStatus_.hidden]]">
        <div id="promoteUpdater"
            class$="cr-row [[getPromoteUpdaterClass_(promoteUpdaterStatus_.disabled)]]"
            actionable$="[[promoteUpdaterStatus_.actionable]]"
            on-click="onPromoteUpdaterTap_">
          <div class="flex">
            [[promoteUpdaterStatus_.text]]
            <a href="https://support.google.com/chrome/answer/95414"
                target="_blank" id="updaterLearnMore"
                on-click="onLearnMoreTap_">
              $i18n{learnMore}
            </a>
          </div>
          <cr-icon-button class="subpage-arrow"
              hidden$="[[!promoteUpdaterStatus_.actionable]]"
              disabled="[[promoteUpdaterStatus_.disabled]]"
              aria-label$="[[promoteUpdaterStatus_.text]]"></cr-icon-button>
        </div>
      </template>
</if>
      <cr-link-row class="hr" id="help" on-click="onHelpTap_"
          label="$i18n{aboutGetHelpUsingChrome}" external></cr-link-row>
<if expr="_google_chrome">
      <cr-link-row class="hr" id="reportIssue" on-click="onReportIssueTap_"
          hidden="[[!prefs.feedback_allowed.value]]"
          label="$i18n{aboutReportAnIssue}" external></cr-link-row>
</if>
      <cr-link-row class="hr" on-click="onManagementPageTap_"
          start-icon="cr:domain" label="$i18n{managementPage}"
          role-description="$i18n{subpageArrowRoleDescription}"
          hidden$="[[!isManaged_]]"></cr-link-row>
    </settings-section>

    <settings-section>
      <div class="info-sections">
        <div class="info-section">
          <div class="secondary">$i18n{aboutProductTitle}</div>
          <div class="secondary">$i18n{aboutProductCopyright}</div>
        </div>

        <div class="info-section">
          <div class="secondary">$i18nRaw{aboutProductLicense}</div>
        </div>
<if expr="_google_chrome">
        <div class="secondary">
          <a href="$i18n{aboutTermsURL}">$i18n{aboutProductTos}</a>
        </div>
</if>
<if expr="not chromeos_ash">
  <template is="dom-if" if="[[shouldShowRelaunchDialog]]" restamp>
    <relaunch-confirmation-dialog restart-type="[[restartTypeEnum.RELAUNCH]]"
        on-close="onRelaunchDialogClose"></relaunch-confirmation-dialog>
  </template>
</if>
      </div>
    </settings-section>
